<template>
	<!-- 优惠券列表 -->
	<div class="content" v-if="is_show == 0">
		<div class="content-top">
			活动管理_活动信息查询
		</div>
		<div class="content-search">
			<el-form :inline="true" class="demo-form-inline" style="margin-top: 20px;">
				<el-form-item label="活动名称：">
					<el-input placeholder="活动名称"></el-input>
				</el-form-item>
                <el-form-item label="活动编号：">
					<el-input placeholder="活动名称"></el-input>
				</el-form-item>
               <el-form-item label="活动类型：">
				   <!-- <el-select placeholder="请选择">
						<el-option
						v-for="item in options"
						:key="item.value"
						:label="item.label"
						:value="item.value">
						</el-option>
					</el-select> -->
				</el-form-item>
                <el-form-item label="活动状态：">
				   <!-- <el-select placeholder="请选择">
						<el-option
						v-for="item in options"
						:key="item.value"
						:label="item.label"
						:value="item.value">
						</el-option>
					</el-select> -->
				</el-form-item>
				<el-form-item label="活动时间：">
					<el-time-picker
						is-range
						range-separator="至"
						start-placeholder="开始时间"
						end-placeholder="结束时间"
						placeholder="选择时间范围">
					</el-time-picker>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" icon="el-icon-search">搜索</el-button>
				</el-form-item>
			</el-form>
		</div>
		<div class="content-operation">
			<el-button type="primary" @click="is_show = 1" icon="el-icon-plus">添加活动</el-button>
		</div>
		<div class="content-table">
			<el-table show-header :data="activityList" stripe style="width: 100%;">
				<el-table-column prop="name" align="center" label="名称"  width="120">
				</el-table-column>
				<el-table-column prop="type" align="center" label="活动类型">
				</el-table-column>
				<el-table-column prop="code" align="center" label="活动编号">
				</el-table-column>
				<el-table-column prop="startTime" align="center" label="开始时间" width="150">
				</el-table-column>
				<el-table-column prop="endTime" align="center" label="结束时间" width="150">
				</el-table-column>
				<el-table-column prop="status" align="center" label="状态">
				</el-table-column>
				<el-table-column prop="status" align="center" label="活动链接">
				</el-table-column>
				<el-table-column label="操作" align="center" width="140">
					<template slot-scope="scope">
						<el-button @click="handleClick(scope.row)" type="text" size="small"><i class="el-icon-edit"></i>详情</el-button>
						<el-button @click="handleClick1(scope.row)" type="text" size="small"><i class="el-icon-delete"></i>删除</el-button>
					</template>
				</el-table-column>
			</el-table>
		</div>
	</div>
    <ActivityAdd v-else-if="is_show == 1" @addActivity="addActivity"></ActivityAdd>
	<ActivityDetail v-else-if="is_show == 2" @addActivity="addActivity" :id="id"></ActivityDetail>
</template>
<script>
import Global from '@/components/Global.vue'
import ActivityAdd from '@/components/activity/ActivityAdd.vue'
import ActivityDetail from '@/components/activity/ActivityDetail.vue'
	export default {
		components: {
			ActivityAdd:ActivityAdd,
			ActivityDetail:ActivityDetail
		},
		props:['power'],
		data() {
			return {
				is_show:0,
				page:1,
				limit:10,
				total:1,
				activityList:[],
				id:''
			}
		},
		mounted() {
			this.get_activity_list()
		},
		methods: {
          addActivity(type){
              if(type == 2){
                 this.get_activity_list()
              }
              this.is_show = 0
		  },
		  /* 获取活动列表 */
		  get_activity_list(){
			  var self = this;
				this.$axios.post(this.$global.serverIp + 'frontend/activity/findPage',{
					"page":self.page,
					"limit":self.limit
				})
				  .then(function (res) {
					  if(res != ''){ 
						self.activityList = res.data.list
						self.total = res.data.totalCount
					  }
						
				  })
		  },
		  handleClick(row){
			  this.is_show = 2
			  this.id = row.id
		  },
		  handleClick1(row){
			  var self = this;
				this.$confirm('此操作将删除该设备, 是否继续?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					$.ajax({
						url: Global.serverIp + 'frontend/activity/delete',
						data: '["' + row.id + '"]',
						xhrFields: {
							withCredentials: true
						},
						beforeSend : function(request) {
							request.setRequestHeader("Authorization", 'Bearer '+localStorage.getItem('token'));
						},
						contentType: 'application/json;charset=utf-8',
						dataType: 'json',
						type: 'delete',
						success: function(res) {
							if (res.code == Global.success_code) {
								console.log(res);
								self.$popup.open("删除成功");
								self. get_activity_list();
							} else {
								self.$popup.open(res.msg);
							}
						},
						error: function(res) {
							if(res.responseJSON.code == '040005'){
								self.$popup.open("登录过期");
							}else{
								self.$popup.open("请求失败");
							}
						}
					})
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});
				});
		  },
        }

	}
	import '@/assets/css/common.css'
</script>
